<template>
  <div class="buyingIfor">
    <template>
      <el-card shadow="hover" style="margin-bottom:20px">
        <div class="total">
          <span>共</span>
          <span>{{dataList.length}}</span>
          <span>种商品</span>
          <!-- <span>{{total.price}}</span> -->
        </div>
        <avue-crud
          ref="index"
          style="width:100%"
          :data="dataList"
          :option="tableOption"
          :table-loading="loading"
        >
          <!-- <template slot="conversionNum" slot-scope="scope">
            <el-input v-model="scope.row.conversionNum" @input="onConversionNumChange">
              <template slot="append">{{scope.row.convertUnit}}</template>
            </el-input>
          </template>
          <template slot="goodSubtotal" slot-scope="scope">
            <el-input v-model="scope.row.goodSubtotal">
              <template slot="append">元</template>
            </el-input>
          </template> -->
          <template slot="menu" slot-scope="scope">
            <el-button type="text" icon="el-icon-remove" @click="del(scope.row.$index)">移除</el-button>
          </template>
        </avue-crud>
      </el-card>
    </template>
  </div>
</template>

<script src='./buyingIfor.js'></script>

<style lang="scss">
.buyingIfor {
  .title {
    padding: 0 0 20px 0;
    font-weight: 500;
    font-size: 24px;
  }
  .total {
    margin: 20px 0;
    span:nth-child(even) {
      font-weight: 600;
      font-size: 18px;
    }
    span:nth-child(odd) {
      font-size: 14px;
    }
  }
}
</style>